<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<% String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath() + "/";
%>
<!DOCTYPE html>
<html>
<head>
    <base href="<%=basePath%>">
    <meta charset="UTF-8">
    <link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet"/>
    <script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
    <script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
    <title>登录</title>
</head>
<body>
<div style="position: absolute; top: 0; left: 0; width: 60%;">
    <img src="image/IMG_7114.JPG" style="width: 100%; height: 90%; position: relative; top: 50px;">
</div>
<div id="top" style="height: 50px; background-color: #3C3C3C; width: 100%;">
    <div style="position: absolute; top: 5px; left: 0; font-size: 30px; font-weight: 400; color: white; font-family: 'times new roman'">
        CRM &nbsp;<span style="font-size: 12px;">客户关系管理系统</span></div>
</div>

<div style="position: absolute; top: 120px; right: 100px;width:450px;height:400px;border:1px solid #D5D5D5">
    <div style="position: absolute; top: 0; right: 60px;">
        <div class="page-header">
            <h1>登录</h1>
        </div>
        <form action="workbench/index.jsp" class="form-horizontal" role="form">
            <div class="form-group form-group-lg">
                <div style="width: 350px;">
                    <input id="loginAct" class="form-control" type="text" placeholder="用户名"/>
                </div>
                <div style="width: 350px; position: relative;top: 20px;">
                    <input id="loginPwd" class="form-control" type="password" placeholder="密码"/>
                </div>
                <div class="checkbox" style="position: relative;top: 30px; left: 10px;">

                    <span id="msg" style="color: red"></span>

                </div>
                <button id="login" type="button" class="btn btn-primary btn-lg btn-block"
                        style="width: 350px; position: relative;top: 45px;">登录
                </button>
            </div>
        </form>
    </div>
</div>
</body>
<script>
    $(function () {
        // 将当前窗口设置为顶层窗口
        if (window.top !== window) {
            window.top.location = window.location;
        }
        //页面加载完毕后，用户输入框自动获得焦点
        $("#loginAct").focus();

    });

    $("#login").click(function () {
        login();
    });

    $(window).keydown(function (event) {
        if (event.keyCode === 13) {
            login();
        }
    });

    function login() {
        let loginAct = $.trim($("#loginAct").val());
        let loginPwd = $.trim($("#loginPwd").val());

        if (loginAct === "" || loginPwd === "") {
            $("#msg").html("账号密码不能为空");
        } else {
            // 发送登录请求
            $.ajax({
                url: "settings/user/login.do",
                data: {
                    "loginAct": loginAct,
                    "loginPwd": loginPwd
                },
                type: "post",
                datatype: "json",
                success: function (data) {
                    /*
                        data: {"result":true/false,"msg":"错误消息"}
                     */
                    let obj = JSON.parse(data);
                    if (obj.result) {
                        window.location.href = "workbench/index.jsp";
                    } else {
                        $("#msg").html(obj.msg);
                    }
                }
            });
        }
    }
</script>
</html>